<template>
  <div class="container">
    <el-collapse v-model="activeNames">
      <el-collapse-item name="1">
        <h1 slot="title">{{ $language.local("批次信息") }}</h1>
        <display-table :model="addForm"></display-table>
      </el-collapse-item>
      <el-collapse-item name="2">
        <h1 slot="title">{{ $language.local("付款明细") }}</h1>

        <xy-table :list="this.addForm.subModel" :columns="payList">
          <template #addItem=""><span></span></template>
          <template #edit=""><span></span></template>
          <template #operation=""> <span hidden></span></template>
        </xy-table>
      </el-collapse-item>
    </el-collapse>
    <div class="form-footer mt-3">
      <el-button
        icon="el-icon-back"
        @click="$router.replace('/review')"
        size="small"
        >返回</el-button
      >
      <el-button
        type="warning"
        icon="el-icon-delete"
        size="small"
        @click="removeItem"
        >移除</el-button
      >
      <el-button type="primary" icon="el-icon-check" size="small" @click="toPay"
        >复核无误</el-button
      >
    </div>
  </div>
</template>

<script>
import API from "../../plugins/api";
export default {
  props: {
    model: Object,
  },
  data() {
    return {
      activeNames: ["1", "2", "3"],
      addFormLables: {
        MerchantCode: "000130",
        MerchantName: "淮北通财网络服务有限公司",
        ServiceProviderName: "湖南好捷科技有限公司",
        BatchNo: "BN21032622120236",
        BatchStatusName: "",
        atime: "2021-03-26T22:12:03",
        TotalNum: 1,
        TotalAmount: 621077,
        BatchSource: "API",
      },
      payList: {
        // ordrId: "XYBN2021032622120400001",
        Indate: "2021-03-26T22:12:04",
        BeneficiaryName: "收款户名",
        idCardNo: "",
        BeneficiaryAccountNumber: "收款账号",
        invoicesubject: "",
        PaymentOutAmount: "交易金额",
        systemCheck: "风控审核",
        sysRtnDesc: "业务状态",
      },
      addForm: this.model,
      id: "",
    };
  },
  created() {
    this.getData();
  },
  methods: {
    async getData() {
      let { api, id } = this.$route.query;
      this.id = id;
      console.log(api, id);
      if (!api) {
        return;
      }
      this.api = new API(api);

      let response = await this.$http.get(this.api.getModel + id);
      console.dir(response);
      this.addForm = response.data.Data;
      delete this.addForm.BatchSttName;
    },
    async removeItem() {
      await this.$http.post(`/api/transaction/Cancel?TBID=${this.id}`);
      this.$router.replace("/review");
    },
    async toPay() {
      const response = await this.$http.get(`/api/transaction/GetRAStatus`, {
        MID: this.addForm.MID,
      });
      console.log(response);
      if (response.data.Data.RAStatus === "0") {
        const response = await this.$http.post(
          `/api/transaction/ToPay?TBID=${this.id}`
        );
        console.log(response);
      }
    },
  },
};
</script>
<style lang="less" scoped>
.batch-info {
  font-size: 1rem;
}
</style>
